<script lang="ts" setup>
import Plate from "./Plate.vue";
import ProTable from "@/components/ProTable/ProTable.vue";
import { reactive } from "vue";
</script>

<template>
  <Plate title="预警信息">
    <div class="flex gap-x-30px p-y-30px">
      <aside class="flex-col-center p-l-30px">
        <img src="../../../assets/images/logo-warn.png" alt="" />
        <span class="text-blue-4 text-20px m-t-20px">预警等级:3级</span>
      </aside>
      <article class="flex-col-between">
        <p>发震时刻：2022-05-28 15:30:21</p>
        <p>震级：MS6.0</p>
        <p>震中：北纬37.71度，东经77.85度</p>
        <p>震源：300KM</p>
        <p>参考位置：距离浙江省杭州市东偏北约203KM</p>
      </article>
    </div>
  </Plate>
</template>

<style lang="less" scoped>
article {
  p {
    line-height: 20px;
  }
}
</style>
